Referencing external style sheets

The Style Sheet window, in addition to the internal style sheet, also lists all external style sheets referenced by the current page. In conjunction with the Style Sheet toolbar and the External Style Sheet Inspector, it also lets you link to an external style sheet, both on your local hard disk and on the Web. You can also link a style sheet to multiple pages in a Web site without having to link to pages one at a time.

To reference an external style sheet:

1 Click the New Item button () in the Style Sheet toolbar. Alternatively, you can right-click (Windows) or Control-click (Mac OS) in the Style Sheet window and choose Add Link to External CSS from the context menu.

2 A new empty reference to an external style sheet appears in the Style Sheet window.

3 Select the empty reference, and go to the External Style Sheet Inspector.

4 In the External Style Sheet Inspector, type in the URL path and filename of the style sheet in the URL text box, click the Browse button to locate the style sheet in the file selection dialog box, or click the Point and Shoot button () to link to a style sheet in the site window.

5 Reference additional style sheets as needed.

If the referenced style sheet contains tag selectors that match the HTML tags used in your document, the document will be reformatted automatically.

6 Use the Move Up and Move Down buttons to change the cascading order for documents with several external style sheets. The Move Up button increases the weight of a style sheet. If conflicts arise between style rules, its styles take precedence over those from style sheets that are lower in the cascade. The Move Down button decreases the weight of a style sheet.

With the style sheet referenced, you can edit it (if it is not write-protected) by selecting the style sheet in the Style Sheet window, and then clicking Open in the External Style Sheet Inspector. You can also just double-click its name in the Style Sheet window.

An easy way to link a page with a style sheet document within the same site is to drag the style sheet file icon from the site window to the small page symbol above the main content area of the document window. After linking the page, the styles from the style sheet will be available for formatting visual page content.

Using Cascading Style Sheets > Applying styles and referencing style sheets > Referencing external style sheets